<table class="form-table">
	% for field in fieldset.render_fields.itervalues():
	<tr style="${c.tr_style(field)}">
		% if field.label():
		<th>${field.label_tag()}:</th>
		% endif
		<td class="${'with-errors' if field.errors else 'no-errors'} ${'field-group' if field.filter else ''}">
			## RENDER FILTER
			##   The special street magic
			% if field.filter:
			<span class="field-filter">
				${field.filter.with_null_as(('--', 0)).render()}
				<a class="hidden-url" href="${url.current(action='get_ids', id='$id', field=field.name)}"></a>
				<select class="temp" style="display:none;"></select>
			</span>
			% endif
			
			## RENDER FIELD
			##   Boolean and gender fields configured at the template level
			##   because no possibility for correct configuration at other levels 
			% if isinstance(field.type, types.Boolean):
				${field.dropdown(options=[(_('Yes'), True), (_('No'), False)]).render()}
			% elif field.name == 'gender':
				${field.dropdown(options=[(_('Male'), 'M'), (_('Female'), 'F')]).render()}
			% else:
				${field.with_null_as(('--', '')).render()}
			% endif
			
			## RENDER ERRORS
			% for error in field.errors:
			<span class="field-error">${error}</span><br/>
			% endfor
		</td>
	</tr>
	% endfor
</table>

<script>

function filter_dropdown() {
	var temp = $(this).children('.temp');
	var filter = $(this).children('select');
	var select = $(this).next('select');
	var url = $(this).children('a').attr('href').replace('%24id', filter.val());
	$.getJSON(url, function(data) {
		var width = select.outerWidth();
		select.children().not(':first').remove();
		temp.children().each(function() {
			var val = Number($(this).val());
			if($.inArray(val, data) >= 0) {
				select.append($(this).clone());
			}
		});
		if(width) {
			select.width(width);
		}
	});
}

$('.field-filter').each(function() {
	var temp = $(this).children('.temp');
	var select = $(this).next('select');
	temp.html(select.html());
});

$('.field-filter').each(filter_dropdown);
$('.field-filter').change(filter_dropdown);

$(window).resize(function() {
	var select = $('.field-filter').next('select').width('100%');
});

</script>